.register{
    width: 400px;
    display: flex;
    flex-direction: column;
    box-shadow: 0px 0px 8px #dedede;
    padding: 20px 0px;
    border-radius: 8px;
}
.register label{
    margin: 12px 30px;
    display: flex;
    flex-direction: row;
}
.register label>span{
    display: inline-block;
    width: 80px;
    text-align: justify;
    text-align-last: justify;
}
.register label i{
    font-style: normal;
    font-weight: bolder;
    padding: 0px 8px;
    color: #666;
}
.register label .input{
    /*
    弹性盒子的子元素分组操作
        1. 所有子元素都定义该属性且没有定义长宽，
            表示基于分组数据之和将父元素宽度平均分配，
            每个子元素依据定义数值获取对应宽度
        2. 子元素部分定义该属性，其它元素未定义，
           将其它元素占用后的剩余父元素空间，基于属性数值和进行平均分配，
           剩余子元素基于定义数值获取对应宽度
    */
    flex-grow: 1;
    position: relative;
}
.input input{
    width: 100%;
    border: 1px solid black;
    outline: none;
    letter-spacing: 1px;
}
.input .error{
    position: absolute;
    color: #f77740;
    background-color: rgba(248, 211, 197, 0.4);
    font-size: 12px;
    padding: 2px 4px;
    width: 100%;
    border-radius: 0px 0px 4px 4px;
}